*{margin:0; padding:0}
img{border-style: none}
form{vertical-align: top}

/*********common settings*****/
a{color:#0084b4; text-decoration: none}
a:hover{text-decoration: underline;}
input, textarea, select{font: 13px/1.5 "Lucida Grande","Lucida Sans Unicode",Helvetica,Arial,Verdana,sans-serif;}
input[type=text], input[type=password]{border: 1px solid #626262; font: 12px/1.5 sans-serif; padding:3px; width: 190px;}
h1,h2,h3,h4,h5{font-weight: normal}
h1{font-size: 20px; line-height: 1em; margin-bottom: 0.3em}
h2{font-size: 17px; line-height: 1em; margin-bottom: 0.3em}
h3{font-size: 14px; line-height: 1em; margin-bottom: 0.3em}
h4{font-size: 13px; line-height: 1em; margin-bottom: 0.3em}

/**************preset****************/
.radius-2{-moz-border-radius:2px; -webkit-border-radius:2px; -o-border-radius:2px; border-radius:2px;}
.radius-3{-moz-border-radius:3px; -webkit-border-radius:3px; -o-border-radius:3px; border-radius:3px;}
.radius-4{-moz-border-radius:4px; -webkit-border-radius:4px; -o-border-radius:4px; border-radius:4px;}
.radius-5{-moz-border-radius:5px; -webkit-border-radius:5px; -o-border-radius:5px; border-radius:5px;}
.radius-6{-moz-border-radius:6px; -webkit-border-radius:6px; -o-border-radius:6px; border-radius:6px;}
.radius-10{-moz-border-radius:10px; -webkit-border-radius:10px; -o-border-radius:10px; border-radius:10px;}
.clear{clear:both;}
.sprite{background-image:url('../images/sprite-icons.png?34234334')}
.fright{float:right}
.fleft{float:left}
.aright{text-align: right}
.aleft{text-align: left}
.btn{    
    padding: 7px 15px;     
    background-color: #019AD2;
    background-image: -moz-linear-gradient(#33BCEF, #019AD2);
    background-image:-webkit-gradient(linear, left top, left bottom, from(#33BCEF), to(#019AD2));
    background-repeat: repeat-x;
    border:1px solid #057ED0;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1) inset;
    color: #FFFFFF;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    box-shadow: 0 1px 0 #FFFFFF;
    cursor: pointer;
    font-weight: bold;
    -moz-border-radius:4px; -webkit-border-radius:4px; -o-border-radius:4px; border-radius:4px;
}
.btn:hover{
    background-color: #0271BF;
    background-image: -moz-linear-gradient(#2DADDC, #0271BF);
    background-image:-webkit-gradient(linear, left top, left bottom, from(#2DADDC), to(#0271BF));
    background-repeat: repeat-x;
    border-color: #096EB3;
    text-decoration: none
}

.btn-highlight{    
    padding: 6px 15px;     
    background-color: #fdb32b;
    background-image: -moz-linear-gradient(center top , #FEE94F 0pt, #FD9A0F 100%);
    background-image:-webkit-gradient(linear, left top, left bottom, from(#FEE94F), to(#FD9A0F));
    background-repeat: repeat-x;
    border:1px solid #ffaa22;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1) inset;
    color: #333;
    text-shadow:0 1px 0 rgba(255, 255, 255, 0.75);
    box-shadow: 0 1px 0 #FFFFFF;
    cursor: pointer;
    font-weight: bold;
    -moz-border-radius:4px; -webkit-border-radius:4px; -o-border-radius:4px; border-radius:4px;
}
.btn-highlight:hover{
    background-color: #0271BF;
    background-image: -moz-linear-gradient(center top , #FEDC4D 0pt, #FD9512 100%);
    background-image:-webkit-gradient(linear, left top, left bottom, from(#FEDC4D), to(#FD9512));
    background-repeat: repeat-x;
    border-color: #ec8b11;
    text-decoration: none
}

/***for debugging**/
.error_log{border:1px solid #ccc; font-size: 11px; font-family: Consolas, Courier, "Courier New", monospace; display: block; width: 450px; margin:20px 0}
#ghostarea{height: 0;  width: 0; overflow: hidden}

/***************sprite****************/
.icon-message-small{background-position: -21px -212px;width: 16px;height: 16px; display: inline-block; margin-right: 6px; vertical-align: middle}


/*********container************/
#container{width: 100%; min-width: 1000px;}
    #container-body{background:#c6e0ec url(../images/wave.png) top left repeat-x;
                    padding-bottom:80px}
    #container-body > .wrap{width:1000px; margin: 0 auto}
    #container-body.container-homepage{padding-top:110px;}
    #container-body.container-registerpage{padding-top:20px;}

/************#ribbon**************/
#ribbon{width:100%; height: 40px; background-color:#0095c2; position: relative; z-index: 100;
            background-image: -moz-linear-gradient(#00a0d1,#008fbb );
            background-image:-webkit-gradient(linear, left top, left bottom, from(#00a0d1), to(#008fbb));
            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25), 0 -1px 0 rgba(0, 0, 0, 0.1) inset;
}

    #ribbon > .wrap{ width:1000px; margin: 0 auto;}
    #logo{float:left; display:block; background-image: url(../images/cab-logo.png); background-repeat: top left no-reapeat; height: 40px; width: 124px; text-indent: -9999px;}
    #ribbon  .rightside{float:right;}
    #ribbon a{color:#fafdff}
    #ribbon a:hover{text-decoration: none}
    
    #ribbon .spliterleft{overflow: auto; display:block; float:right; height: 40px; background: transparent url(../images/sprite-icons.png) no-repeat 0 -430px;}    
        #ribbon .spliterleft.last{border-right:1px solid #26b2db}
        #ribbon .spliterleft.last > a{border-right:1px solid #017fa6}
        #ribbon .spliterleft.first{background-image:none !important}
        #ribbon .spliterleft.nohover:hover{}
        #ribbon .spliterleft a{margin-left:1px; font-weight: bold; font-size: 13px;display:block; height: 30px; padding: 10px 15px 0 15px; text-shadow: -1px -1px rgba(0, 29, 78, 0.4)}        
        #ribbon .spliterleft a:hover,#ribbon .spliterleft a.active,#ribbon .spliterleft.active a{background-color: #009dcd}
        #ribbon .spliterleft > .nohover:hover{background-color:transparent !important}
    #ribbon .btnregister{background: transparent url(../images/btn-gradient-bg.png) bottom left repeat-x; 
                         padding:5px 15px; color:#333333;  text-shadow: 0 1px 0 #FFFFFF;

                         box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25), 0 -1px 0 rgba(0, 0, 0, 0.1)
    }
    #ribbon .btnregister:hover{background-position:top left;}
        
/*****************#signin*********************/
#signin{height: 40px; position: relative;}
    #loginbox{position: absolute; display:none; background-color:#009dcd; right:1px; border:1px solid #017fa6; border-top-style:none; border-bottom-style: none; float:right;
            padding:10px 12px 2px; font: 11px/1.5; color:#fff;            
            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25), 0 -1px 0 rgba(0, 0, 0, 0.1) inset;        
            -moz-border-radius:0 0 5px 5px; -webkit-border-radius:0 0 5px 5px; -o-border-radius:0 0 5px 5px; border-radius:0 0 5px 5px;
    }
    #loginbox table{border-collapse: collapse; width: 270px;}
    #loginbox table label{padding-right: 10px; font-size: 12px;text-shadow: 0 1px 0 rgba(0, 0, 0, 0.5); text-align: right; display: block}
    #loginbox input[type=text],#loginbox input[type=password]{padding:4px;
        border-radius: 4px 4px 4px 4px;
        width:110px;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset, 0 1px 0 rgba(255, 255, 255, 0.25);
        color: rgba(255, 255, 255, 0.75);
        background-color: rgba(255, 255, 255, 0.6);
        border: 1px solid #0081A8;
        outline-style: none;
        color:#333333; 
    }
    #loginbox input[type=text]::-webkit-input-placeholder ,#loginbox input[type=password]::-webkit-input-placeholder  { color:#0092BF; }
    #loginbox input[type=text]:-moz-placeholder,#loginbox input[type=password]:-moz-placeholder { color:#0092BF; }
    
    #loginbox table td{padding-bottom: 0.5em; text-align: right; padding-left: 5px;}
    #loginbox input[type=text]:hover,#loginbox input[type=password]:hover{background-color: rgba(255, 255, 255, 0.7)}
    #loginbox input[type=text]:focus,#loginbox input[type=password]:focus{color:rgba(0, 0, 0, 0.75); background-color: rgba(255, 255, 255, 0.9);}
    #loginbox input[type=submit]{background: transparent url(../images/btn-gradient-bg.png) bottom left repeat-x; 
                         padding:1px 5px; color:#333333;  text-shadow: 0 1px 0 #FFFFFF;
                         border-style: none; cursor: pointer;
                         box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4), 0 -1px 0 rgba(0, 0, 0, 0.1);
                         float:right;
    }
    #loginbox input[type=submit]:hover{background-position:top left;}

    /***************da log in**********/
    .userinfo{overflow: hidden !important;  }
    .userinfo .avatar{border:1px solid #5d5d5d; vertical-align: middle; margin-right:5px;}
    .userinfo .nickname{font-size:12px; font-weight: bold}
    .userinfo a{padding-top:6px !important; padding-bottom:4px !important; }
    .avatar50{width: 50px; height: 50px; display:inline-block;}
    .avatar25{width: 25px; height: 25px; display:inline-block;}
    .notification-icon{background-position: -214px -185px; width: 16px; height:24px; display:block; padding:0 5px;}
    .notificationwrap > a{position: relative;}
    .notificationwrap .notification-count{
                font-weight: bold;
                box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
                position: absolute; display:block; color:#fff; font-size: 10px; background-color:#c32b2b;
                padding:1px 2px; top:3px; right:3px;}
    
    #userexpandbox{position: absolute; display:none; background-color:#009dcd; right:1px; border:1px solid #017fa6; border-top-style:none; border-bottom-style: none; float:right;
            font: 11px/1.5; color:#fff; padding:4px 0; top:40px;      
            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25), 0 -1px 0 rgba(0, 0, 0, 0.1) inset;        
            -moz-border-radius:0 0 5px 5px; -webkit-border-radius:0 0 5px 5px; -o-border-radius:0 0 5px 5px; border-radius:0 0 5px 5px;}
    #userexpandbox li{list-style: none; text-align: right;}
        #userexpandbox li a{padding:4px 10px 4px 5px; display:block; width: 200px; font: 10px/1.5; font-weight: bold; text-shadow: -1px -1px rgba(0, 29, 78, 0.3)}
        #userexpandbox li a:hover{background-color:#0faada}
        
        
        
/******************notification popup**********************/    
#notificationspop{position: absolute; display:none; background-color:#e1eff6; right:1px; border:1px solid #1084a7; border-top-style:none; float:right;
            font: 11px/1.5; padding:4px 0; top:40px;   right:110px; width: 240px;   color:#222;
            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25), 0 -1px 0 rgba(0, 0, 0, 0.1) inset;        
            -moz-border-radius:0 0 5px 5px; -webkit-border-radius:0 0 5px 5px; -o-border-radius:0 0 5px 5px; border-radius:0 0 5px 5px;}
            #notificationspop .whatnews{margin:0; font-size:12px; line-height: 1.5em;  color:#017fa6; font-weight: bold; padding:0 10px; padding-bottom: 5px; border-bottom: 1px solid #bcc9d0} 
            #notificationspop .viewall{font-size:12px; color:#017fa6 !important; font-weight: bold; margin:0 10px; display:block; padding:6px; text-align: center}
            
            #notificationspop .wrap{}
            #notificationspop .noti{cursor: pointer; border-bottom:1px solid #cbdae1; padding:5px 10px 0 10px;; font-size: 11px; line-height: 1.4em}  
            #notificationspop .noti:hover{
                background-color:#f3f8fa;                
            }
            #notificationspop .noti .avatar{display: block; float:left; border:1px solid #696b6b; line-height: 1em; margin:0 10px 10px 0}
                #notificationspop .noti .avatar img{width: 50px; height: 50px; float:left}
                #notificationspop .noti a{color:#1086ab; font-weight: bold;}
                #notificationspop .noti .datetime{color:#999}
    
/************#maincontent**************/
#maincontent{width: 742px; margin: 220px auto;
            -moz-border-radius:0 0 5px 5px; -webkit-border-radius:0 0 0 0; -o-border-radius:0 0 5px 5px; border-radius:0 0 5px 5px;}
    
/************#maintab**************/
#maintab{width:100%; height: 42px; overflow: hidden; background: transparent url(../images/main-tab.png) top left no-repeat;}   
    #maintab.sprite-1{background-position: top left;}
    #maintab.sprite-2{background-position: 0 -42px;}
    #maintab.sprite-3{background-position: 0 -84px}
    #maintab ul li{list-style: none; color:#fff; font-size: 16px; display: block; float:left; font-weight: bold;}
    #maintab ul li a{display:block; padding: 8px 37px; color:transparent; opacity: 0;filter:alpha(opacity=0);}

    
#cablist{width:740px; border:1px solid #aecedb; border-top-style: none; background-color: #effaff; 
    -moz-border-radius:0 0 5px 5px; -webkit-border-radius:0 0 5px 5px; -o-border-radius:0 0 5px 5px; border-radius:0 0 5px 5px;
}
    #cablist .wrap{padding: 10px}
    
    
/*************************************/
.cab{padding-bottom: 10px; margin-bottom:10px; border-bottom:1px dashed #b5c9d2; min-height: 180px; padding-top:20px; position: relative;}
    .cab.last{margin-bottom: 0; border-bottom-style:none; padding-bottom:0}
    .cab .mainpix, .cab .youtube{display:block; float:left; width: 480px; line-height: 1em}
    .cab .mainpix .maskover{height: 30px; background-color:#EFFAFF; width: 100%; position: relative; z-index: 100; margin-top:-30px}
    .cab .info{float:right; width: 220px; float:right}
        .cab .info h1{line-height: 1.3em; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.75); font-weight: normal}
        .cab .info .postime{color:#b3b3b3; font-size: 11px}
        .cab .info .author{}
        .cab .commentcount{}
        .cab .cabmeta{color:#d7d7d7; font-size: 11px}
            .cab .cabmeta a{color:#5fa0ba}            
            
        .cab .info .actionbox{background-position: -98px -320px;width: 220px;height: 51px; margin-top: 1em; position: relative; z-index: 10;}
        .cab .actionbox .votecounter{display: block; float:left ;width: 72px; height: 35px; padding-top:13px; line-height: 1em; text-align: center;}
        .cab .actionbox .votecounter .counter{color:#b56363; font-size: 26px; text-shadow: 0 1px 0 #FFFFFF; }
        .cab .actionbox .votecounter .text{font-size: 10px; color:#666; text-shadow: 0 1px 0 #FFFFFF; }
        .cab .actionbox .heart{display: block; float:left; cursor: pointer; margin-left:2px;height:50px; margin-top:1px;}
            .cab .actionbox .heart.active .heart-icon{background-position: -75px -6px;}
            .cab .actionbox .heart-icon{width: 74px; height:50px;background-position: 14px -5px; display: block }
            .cab .actionbox .heart:hover{background-color:#cde4ed; }
            .cab .actionbox .heart.active{ 
            background-color:#cde4ed;
            background-image: -moz-linear-gradient(#fff292,#fcb641 );
            background-image:-webkit-gradient(linear, left top, left bottom, from(#fff292), to(#fcb641));}
            
            
        .cab .actionbox .commentbox{display: block; float:right; cursor: pointer; height:50px; margin-top:1px;
        -moz-border-radius:0 5px 5px 0; -webkit-border-radius:0 5px 5px 0; -o-border-radius:0 5px 5px 0; border-radius:0 5px 5px 0;
                }
            .cab .actionbox .commentbox.active{background-color:#cde4ed; }    
            .cab .actionbox .comment-icon{width: 69px; height:50px;background-position:8px -55px; display: block }
            .cab .actionbox .commentbox:hover{background-color:#cde4ed;}
            
        .cab .comment-expand{background-color: #cde4ed; margin-top: 1px; padding: 7px 0; width: 220px; display:none;
           box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset;
           -moz-border-radius:0 0 4px 4px; -webkit-border-radius:0 0 4px 4px; -o-border-radius:0 0 4px 4px; border-radius:0 0 4px 4px;
        }  
        .cab .comment-expand textarea{display:block; height: 75px; width:200px; margin: 0 auto; z-index: 1; position: relative; margin-top:1px; padding:4px;
                                      font-size:12px; color:#222; line-height: 1.2em;
        -moz-border-radius:0 0 4px 4px; -webkit-border-radius:0 0 4px 4px; -o-border-radius:0 0 4px 4px; border-radius:0 0 4px 4px;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset, 0 1px 0 rgba(255, 255, 255, 0.25);
        background-color: rgba(255, 255, 255, 0.6);border: 1px solid #9FBDC9;}
        
        .cab .comment-expand textarea:hover{background-color: rgba(255, 255, 255, 0.8)}
        .cab .comment-expand textarea:focus{background-color: rgba(255, 255, 255, 1); outline-style:none}
            .cab .comment-expand textarea::-webkit-input-placeholder{color:#eee}
            .cab .comment-expand textarea:-moz-placeholder{color:#666}
            
		.cab .entry-op{background-color: #DFF0D8;  border: 1px solid #D6E9C6;}
            
/*****************JUMPER**************/
#jumper{border-top:1px solid #aecedb; background-color: #e6f0f5; padding:23px; overflow: auto;
    -moz-border-radius:0 0 5px 5px; -webkit-border-radius:0 0 5px 5px; -o-border-radius:0 0 5px 5px; border-radius:0 0 5px 5px;
    box-shadow: 0px 0px 0px 2px rgba(255,255,255, 0.5) inset;}
    #jumper > a{border:1px solid #6593a1; display: block; float:left; width:313px;  text-decoration: none;
                box-shadow: 0px 0px 0px 2px rgba(255,255,255, 0.1) inset;
        background-color: #79b4d1; padding:8px; text-align: center; color:#fff; text-transform: uppercase; font-size: 13px; font-weight: bold}
    #jumper > a.gonext{float:right;}
    #jumper > a:hover{background-color: #8fc4df}
    
/******************SIDEBAR*******************/
#trymxanh{position: absolute; display:block; margin-top:-13px; right:0}
#sidebar{float:right;width: 250px; overflow:hidden}
    #sidebar .sidebarblock{border:1px solid #aecedb;background-color:#eef7fb; margin-bottom:20px; position: relative}
    .sidebarblock > .wrap{padding: 10px;}
    .sidebarblock h3{font-size: 16px; color:#666;  margin-bottom: 0.5em; font-weight: bold; padding:10px;}
    .sidebarblock h3 em{font-size: 12px; color:#6d787d; font-weight: normal}
    .sidebarblock .splitter{font-size: 16px; color:#384146; padding:6px;}
    .sidebarblock .icon-comments{background-position: -104px -212px;width: 16px;height: 16px; display:inline-block; margin-right:10px;}
    .sidebarblock small {font-size:10px; color:#666}
    
    .block-topcomment .entry{padding-top:5px; padding-bottom:5px; border-top:1px dotted #fff; border-bottom: 1px solid #e4e4e4}
    .block-topcomment .entry-first{border-top-style: none !important}
    .block-topcomment .entry-last{border-bottom-style: none !important}
    .block-topcomment .entry img{float:left; display:block; padding:2px; background-color:#fff;}
    .block-topcomment .entry > div.post{float:right; width: 135px;}
        .block-topcomment .entry h4{font-size: 13px; line-height: 1.5em; margin-bottom: 0.4em; font-weight: bold}
    
        .block-devtem{padding-bottom:30px;}
    .block-devtem h4{line-height: 1.5em; margin-bottom: 0em; font-weight: bold}
    .block-devtem .wrap{padding-top:0 !important}
        .block-devtem h4 em.datetime{font-size: 10px; color:#999999}
        .block-devtem p{line-height: 1.4em; margin-bottom: 0.5em}
        .block-devtem .readmore{text-align: right}
        .block-devtem .datetime{font-size: 11px; color:#444}
        
    .block-topcaber .caber{}
        .block-topcaber .caber .thumb{display:block; float:left; margin: 0 10px 10px 0;}
        .block-topcaber .caber .info{width: 190px; float:right;}
        .block-topcaber .caber .info .stats{font-size: 11px; margin:0; color:#999}
        .block-topcaber .caber .info h4{font-weight: bold}
        .block-topcaber .caber .info .dofollow{color:#fff; font-size: 10px; 
            padding:1px 4px; border-style: none;
            background: url("../images/btn-gradient-bg.png") repeat-x scroll left bottom transparent;
            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25), 0 -1px 0 rgba(0, 0, 0, 0.1);}
        .block-topcaber .caber .info .dofollow:hover{text-decoration: none;}
        .block-topcaber .caber .info .alreadyfollowed{background-color:#53bf1e !important; background-image: none}
/*************************************/
.btnpostcab{background-position: -100px -240px; width: 162px;height: 32px; display: block; text-indent: -9999px; margin-right:10px; float:left; position: relative; top:3px;}
    .btnpostcab:hover{background-position:-100px -273px;}
    
    
/************narrowform-container**********************/
.narrowform-container{width:780px; margin:40px auto 20px auto; background-color:#e1eff6; background-color:rgba(225,239,246,0.7);  padding:40px;}
    .narrowform-container .webform-bg{background-position: -1px -512px;
               width: 224px;height: 190px; float:left}
    .narrowform-container .webform-bg{background-position:-1px -512px; width: 224px; height: 190px;   }
    .narrowform-container .webform-bg-sad-fish{background-position: 0 -702px;width: 224px;height: 190px;}
    .narrowform-container .form-content{width:480px; float:right; margin-right:40px;}
    .narrowform-container .form-content h1{font-size:40px; color:#1499c2; text-shadow: 0 1px 0 #FFFFFF; line-height: 1em; margin-bottom: 10px}
    .narrowform-container .form-content h1 em{font-size: 16px; color:#126985; font-style: normal;}
    .narrowform-container .form-content .heading-wrap-join-warning {background-position: -1px -904px;
        width: 406px;height: 59px;}
    .narrowform-container .form-content .heading-wrap-login{background-position:  0 -1057px !important;
	width: 456px !important;
	height: 59px !important;}
    .narrowform-container .form-content .heading-404{background-position: -1px -979px !important;width: 274px;height: 66px; text-indent: -9999px}
    
    
        .narrowform-container .form-content .heading-wrap-join-warning *{text-indent: -9999px}
        .narrowform-container .form-content .messages{background-color:#FFF5BC; padding:5px 10px; margin: 0 0 10px;}
        
    .form-content .heading{margin-bottom:40px;}    
    .form-content label{color:#105a71; text-shadow: 0 1px 0 #FFFFFF;  font-size:14px;}
    .form-content table td{padding-bottom: 1em}
    .form-content input[type=text], .form-content input[type=password]{
        font-size: 15px; padding: 6px;
        border-radius: 4px 4px 4px 4px;
        width:300px;
        color: rgba(0,0,0, 0.75);
        border: 1px solid #CCCCCC;
        box-shadow: 0 1px 0 #EEEEEE inset, 0 1px 0 #FFFFFF;        
        background-color: rgba(255, 255, 255, 0.6);
        border: 1px solid #338da8;
        outline-style: none
    }
    .form-content input[type=text]:focus, .form-content input[type=password]:focus{
        border: 1px solid #56B4EF;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) inset, 0 0 8px rgba(82, 168, 236, 0.6);
    }
    
/******************single cab**********************/    
.singlecab{}
    .singlecab .cabheading{background-color:#ecf4f8; color:#eef7fb; padding:12px; 
    -moz-border-radius:5px 5px 0 0; -webkit-border-radius:5px 5px 0 0; border-radius: 5px 5px 0 0; border-top:1px solid #0296c7}
    .singlecab .cabheading h1{font-size: 20px; text-shadow: -1px -1px rgba(0, 29, 78, 0.3)}
    .singlecab .cabmetric{width: 610px; float:left;}
    
    .singlecab .cabheading a{font-weight: bold;text-decoration: underline; font-style: italic;}
    .singlecab .cabheading .datetime{color:#b1d6e9;}
    .singlecab .cabheading .vote-icon{background-position:-302px -20px; height: 15px; width:16px; padding-left:23px;}
    .singlecab .cabheading .comment-icon{background-position: -302px -47px;	height: 16px; width:16px; margin-right:10px;  padding-left:25px;} 
    .singlecab .cabheading .vote,.singlecab .cabheading .comment{margin-left: 6px;}
    
    
    .singlecab .cabheading .quickvote{float:right; padding:0px; background-color: transparent}
        .singlecab .cabheading .quickvote > a{background-position: -304px -76px;width: 56px;height: 46px; display: block; line-height: 1em;
                                border:1px solid transparent; }
        
        .singlecab .cabheading .quickvote:hover {background-color:#a9e7fa}
        .singlecab .cabheading .quickvote a.active{background-position: -304px -123px;}
    /********main****/
    .singlecab .facebookconnect{background-color:#e1eff6; border-bottom:1px solid #aecedb; padding: 5px 10px 0px 10px; margin-bottom: 20px;}
    .facebookconnect .fb-like{float:left;}
    .singlecab .singlecabmain{background-color:#fffff; border:1px solid #aecedb; background-color:#fff; -moz-border-radius: 0 0 5px 5px; -webkit-border-radius: 0 0 5px 5px; border-radius: 0 0 5px 5px}
        .singlecab .singlecabmain .cabimage{text-align: center}
        .singlecab .singlecabmain .cabimage img{max-width: 640px;}
        .singlecab .cabimage .maskover{height: 34px; background-color:#fff; width: 100%; position: relative; z-index: 100; margin-top:-34px}
        
    /********back stories****/    
    .singlecab .backstories{background-color:#f3f3f3; border-top:1px solid #d3d3d3; border-bottom:1px solid #d3d3d3; padding: 20px 20px 10px 20px; margin-top:20px;}    
        .singlecab .backstories h2{color:#22222; font-size: 12px;  text-transform: uppercase; border-bottom: 1px solid #d3d3d3; padding-bottom:7px; margin-bottom: 1em}
            .singlecab .backstories h2 span{display: block; float:left; background-position: -19px -401px;
                    width: 14px; height: 14px; margin-right: 10px;}
        .singlecab .backstories .wrap{}
        .singlecab .backstories .char{width: 220px; float:left; margin-right: 10px; font-size: 11px;}
            .backstories .char .avatar{float:left; border:1px solid #ccc; margin: 0 10px 10px 0; display:block; line-height: 1em}
                .backstories .char .avatar img{width: 60px; height: 60px; }
            .backstories .char h3 a{font-size: 12px; font-weight: bold;}
            .backstories .char a{}
        
    /********comments****/    
    .singlecab .communitycomment{ -moz-border-radius: 0 0 5px 5px; -webkit-border-radius: 0 0 5px 5px; border-radius: 0 0 5px 5px}
        .singlecab .communitycomment .wrap{padding:10px 20px 20px}
        .singlecab .communitycomment h2{color:#b5b5b5; font-size: 12px;  text-transform: uppercase; border-bottom: 1px solid #d3d3d3; padding-bottom:7px}
            .singlecab .communitycomment h2 span{display: block; float:left; background-position: -22px -291px;
                    width: 14px;	height: 14px; margin-right: 10px;}
            
    /** blank comment entry, to be filled by ajax comment **/    
    #comment_entry_blank{display: none}        
    
    .communitycomment .entry-content{color:#222; font-size: 11px; word-wrap: break-word}
        .communitycomment .entry-content .avatar{max-width: 45px; max-height: 45px; widows: 45px; height: 45px; float:left; margin: 0 10px 2px 0; border:1px solid #eee}
        .communitycomment .entry-content .datetime{color:#ccc}
        .communitycomment .entry-content .rate{color:#b62020;}
            .communitycomment .entry-content .entry-details{margin-top:5px;}
            .communitycomment .entry-content .entry-details .adminaction span{color:#0084B4; cursor: pointer;}
            .communitycomment .entry-content .entry-details .adminaction span:hover{text-decoration: underline}
            .communitycomment .entry-content .entry-details .report .icon-flag{background-position: -22px -329px; width: 12px; height: 15px; display: inline-block; margin-right:5px;}
            .communitycomment .entry-content .entry-details .report{margin-left:10px; visibility: hidden}
            .communitycomment .entry-content:hover .report{visibility: visible }
            .communitycomment .entry-content:hover{border-right:1px solid #b8b8b8}
        .communitycomment .entry-content .textwrap{word-break: break-all; padding-right: 5px}
        .communitycomment .entry-content .textwrap em.hide{color:#ccc}
        .communitycomment .entry-content .textwrap p{margin-bottom:0.5em}
        .communitycomment .entry-content .entry-text{width: 640px; float:left;}
        .communitycomment .entry{border-bottom:1px solid #f2f2f2; padding:5px 0}
    .communitycomment .sub-entries{width: 660px; margin-left:40px; padding-top: 10px;}
        .communitycomment .sub-entries .entry-text{width: 590px;}
        .communitycomment .sub-entries .entry-content{background-color:#ecf4f8; margin-bottom:1px; padding:5px;}
        
    /********comment replys****/ 
    .communitycomment .replycomment{border-top:1px solid #aecedb; padding:10px; background-color:#e6f0f5; border-radius: 0 0 5px 5px}
        .communitycomment .replycomment form{overflow:auto; }
        .communitycomment .replycomment .avatar{border:1px solid #ccc; max-width: 45px; max-height: 45px; widows: 45px; height: 45px; float:left; margin: 0 10px 10px 0;  line-height: 1em}
        .communitycomment .replycomment textarea{background-color: #CDE4ED; width:650px; border-radius:2px;
            box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset;   display: none;   margin-top: 1px;
            padding: 5px;    height: 50px;  display:block;  border: 1px solid #9FBDC9}
        .communitycomment .replycomment textarea:focus{background-color:#fff}
        .communitycomment .replycomment .mainbtn{padding: 4px 7px; display:block; float:right; margin: 10px 0; clear:both}
        .communitycomment .replycomment .desc{font-size: 11px; color: #888; margin-left: 60px;}
        
        
        /**********inline-comment*******/
        #reply-comment-inline-block{display:none}
        .communitycomment .sub-entries .reply-content textarea{background-color: #D5E9F2; width:570px;
            box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset;   display: none;   margin-top: 1px;
            padding: 5px;    min-height: 1.2em; display:block;  border: 1px solid #9FBDC9; float:left}
        .communitycomment .sub-entries .reply-content .avatar{float:left;border:1px solid #ccc; max-width: 45px; max-height: 45px; widows: 45px; height: 45px; float:left; margin: 0 10px 10px 0;  line-height: 1em}
        .communitycomment .sub-entries .reply-content textarea:focus{background-color:#fff}
        .communitycomment .sub-entries .reply-content{background-color:#ecf4f8; margin-bottom:1px; padding:5px;}
        .communitycomment .sub-entries .reply-content .mainbtn{font-size:11px; padding:3px 4px;}
        .communitycomment .sub-entries .reply-content .controls{text-align: left; display: block; float:left; margin-top:2px; margin-left:56px;}
        
        
    /*************profilepage*************/
    .profilepage{border:1px solid #80a3b3; border-radius: 5px !important; background-color:#fff}
        .profilepage .profilehead{position: relative;}
    
        .profilepage .profilenav{border-top:1px solid #b3d4e4; border-bottom:1px solid #017fa6; margin-top:10px;
        background-image: -moz-linear-gradient(#00a0d1,#008fbb );
            background-image:-webkit-gradient(linear, left top, left bottom, from(#00a0d1), to(#008fbb));}
        .profilepage .profilenav ul{overflow:auto; padding-left:180px;}
        .profilepage .profilenav li{list-style: none; float:left;}
        .profilepage .profilenav li a{display: block; line-height: 1em; padding: 13px 10px 0px 10px; height: 25px; border-left:1px solid #b3d4e4; border-right:1px solid #017fa6;
            color:#ffffff; font-size: 14px; font-weight: bold; text-shadow:-1px -1px rgba(0, 29, 78, 0.5)}
        .profilepage .profilenav li a:hover,.profilepage .profilenav li.active a{background-color: #13AEDD; text-decoration: none}
        .profilepage .mainavatar{padding:2px; background-color: #b3c8d1; width: 100px; z-index: 100; float:left; margin:25px 0 0 40px}
        .profilenav .icon-settings-nav{background-position: -482px -541px;	width: 24px;	height: 23px; display:block}
        
    .profilepage .profilestats{min-height: 150px;}
    .profilepage .profilestats .stat{ float:left; width: 350px; float:left; margin-left: 37px; margin-top:22px}
    .profilepage .statblocks{margin-top:22px;}
        .profilepage h3.about{font-size: 11px; color:#ccc; line-height: 1.5em}
        .profilepage .statblocks .block{float:left; width: 106px; margin-right:10px}
        .profilepage .statblocks .block .desc{display:block;}
            .profilepage .statblocks .icon-stat-love{display:block; float:left; background-position:-3px -1140px; width: 28px;height: 24px;}
            .profilepage .statblocks .icon-stat-cab{display:block; float:left; background-position:-4px -1185px; width: 28px;height: 24px;}
            .profilepage .statblocks .icon-stat-followers{display:block; float:left;  background-position:-3px -1227px; width: 35px;height: 21px;}
            .profilepage .statblocks .number{font-size:20px; color:#333; position: relative; top:-4px; margin-left:10px}
            .profilepage .statblocks .desc{display:block; font-size:11px; border-top:1px solid #ccc}
            
    .profilestats .secfollow{float:right; margin:25px 25px 0 0}
    .profilestats .secfollow .btn-highlight,.profilestats .secfollow .btn{display:block;}
    .badge{display:inline-block; width: 10px; height: 10px; vertical-align:  middle}
    .badge-gray{background-position: -24px -1282px; }
    .badge-green{background-position: -40px -1282px; }
    .badge-orange{background-position: -6px -1282px; }
    .badge-fish{background-position: -55px -1282px; width: 13px; height: 11px;}
    /********feedflow****/    
    .profilepage .feedflow{background-color:#fff; border-radius:0 0 5px 5px}
        .feedflow .feedcontent{width:540px; float: right; margin-right:20px; padding:20px 0;}
        .feedflow .icon-newfeed{background-position: -478px -3px; width: 22px;height: 19px; display: inline-block; margin-right:0.5em;}
        .feedflow h2{padding-bottom:2px; border-bottom: 1px solid #d9d9d9; margin-bottom:16px;}
        .feedflow p{margin-bottom: 1em}
        
        .feedflow .feedentry{padding-bottom:10px; margin-bottom:10px; border-bottom: 1px solid #f4f4f4}
            .feedflow .feedentry h4{font-size: 12px; line-height: 1.5em; margin-bottom: 1em}
            .feedflow .feedentry .attrs{font-size: 11px}
            .feedflow .feedentry .datetime{color:#999; font-size: 11px;}
            .feedentry .vote-icon{background-position:  -21px -170px;height: 15px; width: 16px; margin-right:5px; display: inline-block}
            .feedentry .vote{margin-right:5px;}
            .feedentry .wrap{width:515px; float: right;}
                .feedentry .wrap .thumb img{width: 240px}
            .feedentry .comment-icon{background-position:   -22px -291px;height: 14px; width: 14px; margin-right:5px; display: inline-block}
            .feedentry .comment-text{padding:2px; margin-bottom: 1px; font-size: 11px; background-color:#DFEEF5; width: 400px}
            .feedentry .comment-text .reply-comment{background-color:#f3f3f3; padding-left: 10px;}
            .feedentry .comment-outter{margin-bottom:20px}
            .feedentry .comment-text .comment-avatar{display:block; float:left; line-height: 1em}
                .feedentry .comment-text .comment-avatar img{width: 40px;}
            .feedentry .comment-text .comment-wrap{float:left; margin-left: 10px; width: 343px} 
                .feedentry .comment-text .comment-wrap p{margin-bottom:0.4em}
            
        .feedflow .icon-newpost{background-position: -489px -59px;width: 11px;height: 14px; float:left;}
        .feedflow .icon-newcomment{background-position: -486px -115px;width: 14px;height: 14px; float:left;}
        .feedflow .icon-newvote{background-position: -486px -174px;width: 14px;height: 14px; float:left;}
        .feedflow .icon-newfollow{background-position: -485px -237px;width: 15px;height: 14px; float:left; position: relative; top:-2px}
        .feedflow .btnloadmore{background-color: #aaa;   border: 1px solid #999;    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1) inset;
            color: #FFFFFF;    display: block;  width: 100%; cursor:pointer; margin: 0 auto;
            font-size: 13px;    font-weight: bold;
            padding: 8px;    text-align: center;
            text-decoration: none;    text-transform: uppercase; width: 313px;}
        .feedflow .btnloadmore:hover{background-color:#bbb}
        
    /*******************settingspane********************/
    .settingspane{float: right; margin-right: 20px; padding: 20px 0; width: 540px;}
        .settingspane h3{padding-bottom:2px; border-bottom: 1px solid #d9d9d9; margin-bottom:14px;}
        .settingspane .icon-profile{background-position: -483px -305px; width: 19px; height: 15px; display:inline-block; margin-right:6px}
        .settingspane .icon-settings{background-position: -483px -359px;width: 18px;height: 17px; display:inline-block; margin-right:6px}
        .settingspane .icon-rss{background-position:-483px -417px;width: 16px;	height: 17px; display:inline-block; margin-right:6px}
        .settingspane .icon-avatar{background-position:-483px -489px;	width: 19px;	height: 13px;         display:inline-block; margin-right:6px}
        .settingspane .notice{background-color:#FFEFC6; padding:5px;}
        
        .settingspane input[type=text], .settingspane input[type=password]{
        font-size: 12px; padding: 6px;
        border-radius: 4px 4px 4px 4px;
        width:300px;
        color: rgba(0,0,0, 0.75);
        border: 1px solid #CCCCCC;
        box-shadow: 0 1px 0 #EEEEEE inset, 0 1px 0 #FFFFFF;        
        background-color: rgba(236, 242, 234, 0.8);
        border: 1px solid #338da8;
        outline-style: none
    }
    
    .settingspane input[type=text]:focus, .form-content input[type=password]:focus{
        border: 1px solid #999;
        background-color: rgba(255,255,255,0.7);
        /*box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) inset, 0 0 8px rgba(82, 168, 236, 0.6);*/
    }
    .settingspane input[readonly]{background-color:#ddd}
    
    .tblsetting{}
    .tblsetting label{display: block; width: 100px;}
    .tblsetting td{vertical-align: top; padding-bottom: 1em}
    .settingspane .btn{padding:3px 5px; font-size:12px;}
    #uploadpercent{display:none;}
    .block-change-avatar .avatar{display: block; float:left; width: 60px; height: 60px; margin: 0 10px 10px 0}
    .block-change-avatar .avatarwrap{}
    .block-change-avatar .avatarwrap .actions{float:left; display:block; width: 345px; font-size: 11px; color:#666}
    .settingspane .block-change-avatar .avatarwrap .actions p{margin-bottom:0.7em; line-height: 1.8em}    
    .settingspane .block-change-avatar .notice{display: none;}
    .block-change-avatar .ajaxwaiting{display:none}
    
    
    /************************settingsnav**********************/
    .settingsnav{display:block; padding:20px 0; float:left; margin-left:20px; }
    .settingsnav li{list-style: none;}
    
    
    /**************************create cab******************************/
    #createCab{padding:0}
        #createCab .form-content{float:left; width:100%; margin: 0}
            .contentwrap h3{font-size: 20px; line-height: 1.4em; margin-bottom:1em; text-shadow:0 1px 0 #FFFFFF}
        #createCab .contentwrap{padding: 20px;}
        #createCab .choosenav{}
        #createCab .choosenav li{list-style: none; font-size: 26px; display:block;}
        #createCab .choosenav li a{display:block; float:left; padding: 5px 15px;text-shadow:-1px -1px rgba(0, 29, 78, 0.3);text-decoration: none; color:#fff; border-right:1px solid #017FA6}
        #createCab .choosenav li a:hover,#createCab .choosenav li.active a{background-color:rgba(255,255,255,0.2)}
        .choosenav .icon-picture{background-position:-475px -617px; width: 33px; height: 24px; display:inline-block;vertical-align: middle; margin-right:10px; position: relative; top:-2px}
        .choosenav .icon-video{background-position:-477px -690px;	width: 34px;	height: 27px; display:inline-block; vertical-align: middle; margin-right:10px; position: relative; top:-2px}
        .navwrap{box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25), 0 -1px 0 rgba(0, 0, 0, 0.1) inset;background-image: -moz-linear-gradient(#00a0d1,#008fbb );
            background-image:-webkit-gradient(linear, left top, left bottom, from(#00a0d1), to(#008fbb)); 
        -moz-border-radius:5px 5px 0 0;-webkit-border-radius:5px 5px 0 0;border-radius:5px 5px 0 0;
        }
        #createCab .form-content form{float:left; width: 470px;}
        #createCab .form-content form td{padding-bottom:3em; vertical-align: top; position: relative;}
        #createCab .form-content form p.desc{font-size: 11px;color:#666}
        #createCab .form-content label{width:150px; display:block;}
        #createCab .form-content  label.error{display: block; background-color:#FFEFC6; font-size: 12px; padding:5px}
        #createCab .form-content label em{color:#999; font-style: normal; font-size: 11px}
        #createCab .form-content .icon-ccml{display:inline-block;background-position:  -473px -788px;	width: 38px; margin-left:10px}
        
        .create-post-ok{ text-align: center;}
        .create-post-ok h2{font-size:40px; line-height: 2em; margin-bottom:10px}
        .create-post-ok img.cab{}
        .create-post-ok .maskover{background-color: #D9EBF3;    height: 30px;    margin-top: -35px;    position: relative;    width: 100%;    z-index: 100;}
        .create-post-ok .addthis{width:400px; text-align: center; margin: 0 auto; margin-bottom:2em}
        
        
    /**********#reportcomment******************/
    #popupholder{display:none;width:0; height: 0}
    .communitycomment #reportcomment label{ width: 380px;}
    .blockpopup{width:400px; padding:20px;}
    .blockpopup h3{font-size: 18px; margin-bottom: 10px; padding-bottom:6px; border-bottom:1px solid #ccc}
    .blockpopup table td{vertical-align: top; padding:10px 5px}
    .blockpopup table label{display: block; }
    .blockpopup .thanks{display:none}
    .blockpopup li{font-size: 11px; ;list-style-position: outside; margin-left:2em}
    
/*****************notice**************/
#cablist .notice{background-color:#fff9d9; padding:5px; font-size:11px; color:#999}


/**************post manage in single cab***********************/
#postmanage{display: block; float:right; padding:2px 7px; border:1px solid transparent; cursor:pointer; position:relative}
    #postmanage:hover{text-decoration: none;background-color:#fff}
    #postmanage:hover ul{display:block;}
    #postmanage .icon-manage{background-position:  -23px -252px;width: 16px;height: 16px; display:inline-block; vertical-align: middle; margin: 0 5px 0 0}
    #postmanage ul{display:none; float: right; position: absolute; background-color: #fff; right:-1px;box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25), 0 -1px 0 rgba(0, 0, 0, 0.1) inset;}
    #postmanage ul li{list-style: none; display: block;overflow: auto; text-align: right; padding-top:1px;}
    #postmanage ul li span{display: block; width: 170px; padding:5px;}
    #postmanage ul li span:hover{background-color:#c6e0ec; text-decoration: none;}
    
    
/********************frmJoinTheCab*********************/
#frmJoinTheCab{}
    #frmJoinTheCab .message{background-color:#fcffcf; margin-bottom:2em}
    #frmJoinTheCab .message li{list-style: none; margin-left: 1em; padding:5px}
    
    
    
/***********************/
#blockbanuser{}
    #blockbanuser textarea{width: 400px; height: 150px}